<template>
	<div>
		<!-- nav -->
		<van-nav-bar 
		 left-text="返回"
		  title="个人信息"
		  placeholder
		  fixed
		  @click-left="onClickLeft"
		/>
		<div class="wrap-userinfo">
			<div class="userinfo-child-wrap">
				<span>头像</span>
				<img src="../../../assets/mypic.jpg" alt="">
			</div>
			<userinfoChild v-for="(item,index) in list" :key="index">
				<span slot="title">{{item.unameone}}</span>
				<span slot="uname">{{item.unametwo}}</span>
			</userinfoChild>
		</div>
	</div>
</template>

<script>
	// import { Toast } from 'vant';
	import userinfoChild from './userChild/userinfoChild.vue'
	export default{
		data(){
			return{
				list:[
					{
						"unameone":"姓名",
						"unametwo":"王占胜",
					},
					{
						"unameone":"姓别",
						"unametwo":"男",
					},
					{
						"unameone":"当前状态",
						"unametwo":"在校生",
					},
					{
						"unameone":"出身年月",
						"unametwo":"2000-02-03",
					},
					{
						"unameone":"现居住城市",
						"unametwo":"西安市雁塔区",
					},
					{
						"unameone":"户口所在地",
						"unametwo":"榆林市",
					},
					{
						"unameone":"政治面貌",
						"unametwo":"团员",
					},
					{
						"unameone":"手机号码",
						"unametwo":"17612995801",
					},
					{
						"unameone":"电子邮箱",
						"unametwo":"2585717148@qq.com",
					}
				]
			}
		},
		components:{
			userinfoChild
		},
		methods:{
			onClickLeft() {
				this.$router.replace('/')
			},
		}
	}
</script>

<style lang="scss">
	.wrap-userinfo{
		padding: 20px;
	}
	.userinfo-child-wrap{
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 0 10px 0;
		border-bottom: 1px solid rgba(186, 186, 186, 0.5);
		img{
			width: 80px;
			height: 80px;
			border-radius: 50%;
		}
	}
</style>
